<nz-table #nzTable
          [nzAjaxData]="tableData"
          [nzTotal]="total "
          [nzLoading]="loading"
          [(nzPageIndex)]="pageIndex"
          (nzPageIndexChange)="_refreshData()"
          [nzPageSize]="pageSize"
          (nzPageSizeChange)="_refreshData()">
  <thead nz-thead>
  <tr>
    <th nz-th [nzCheckbox]="true">
      <label nz-checkbox [(ngModel)]="_allChecked" [nzIndeterminate]="_indeterminate"
             (ngModelChange)="_checkAll($event)">
      </label>
    </th>
    <ng-template ngFor let-fieldObj [ngForOf]="gridView.tableFields" let-i="index">
      <th nz-th *ngIf="fieldObj.hidden!==false"><span>{{fieldObj.text}}</span></th>
    </ng-template>
  </tr>
  </thead>
  <tbody nz-tbody>
  <tr nz-tbody-tr *ngFor="let data of nzTable.data">
    <td nz-td [nzCheckbox]="true">
      <label nz-checkbox [(ngModel)]="data.checked" (ngModelChange)="_refreshStatus($event)">
      </label>
    </td>
    <ng-template ngFor let-fieldObj [ngForOf]="gridView.tableFields" let-i="index">
        <td nz-td *ngIf="(!fieldObj.type||fieldObj.type===1)&&fieldObj.hidden!==false">
          {{data[fieldObj.field]}}
        </td>
        <td nz-td *ngIf="(fieldObj.type&&fieldObj.type===3)&&fieldObj.hidden!==false">
          <img src="{{data[fieldObj.field]}}" alt="">
        </td>
        <td nz-td *ngIf="(fieldObj.type&&fieldObj.type===4)&&fieldObj.hidden!==false">
          {{data[fieldObj.field]}}
        </td>
        <td nz-td *ngIf="(fieldObj.type&&fieldObj.type===2)&&fieldObj.hidden!==false">
          <nz-dropdown>
            <button nz-dropdown nz-button style="border: none">
              <i class="anticon anticon-bars" style="margin-right: 2px;"></i>
              <i class="anticon anticon-down"></i>
            </button>
            <ul nz-menu>
              <ng-template ngFor let-handle [ngForOf]="gridView.operations" let-i="index">
                <li nz-menu-item>
                  <a href="javascript:;" *ngIf="!handle.isConfirm;else elseBlock"
                     (click)="handle.event(data[handle.key]||data.id)">{{handle.text}}</a>
                  <ng-template #elseBlock>
                    <nz-popconfirm [nzTitle]="handle.title"
                                   (nzOnConfirm)="handle.event.ok(data[handle.key])"
                                   (nzOnCancel)="handle.event.cancel()">
                      <a href="javascript:;" nz-popconfirm>{{handle.text}}</a>
                    </nz-popconfirm>
                  </ng-template>
                </li>
              </ng-template>
            </ul>
          </nz-dropdown>
        </td>
    </ng-template>
  </tr>
  </tbody>
</nz-table>
